<div style="display:flex; flex-direction:column;height:90vh;">
  <div style="display:flex;flex-direction:row;flex-wrap:wrap;height:100vh;">
    <div style="margin:0 2%;padding:0.5% 1%;">
      <h1>使用方式</h1>
      <mark>为了避免彼此冲突, 建议使用git将代码拉到本地开发</mark>
      <ol start="1" type="1" style="font-size:20px">
        <li><code style="background:#002833;color:white">ssh oss@182.10.2.28</code></li>
        <li>password: <code style="color:white">ossadmin</code></li>
        <li>cd /opt/rails-project/blog</li>
        <li>begin code...</li>
        <li>浏览器访问 http://182.10.2.28:9999 + path</li>
      </ol>
    </div>

    <div style="margin:0 2%;padding:0.5% 1%;">
      <h1>有用的工具网站</h1>
      <div>
        <h4>入门文档</h4>
        <a href="https://ruby-china.github.io/rails-guides/getting_started.html">rails guides中文版</a>
      </div>
      <div>
        <h4>查询问题</h4>
        <a href="https://stackoverflow.com/">stackoverflow</a>
      </div>
      <div>
        <h4>ruby中文社区</h4>
        <a href="https://ruby-china.org/">ruby-china</a>
      </div>
      <div>
        <h4>git教程</h4>
        <a href="https://git-scm.com/book/zh/v1/Git-%E5%9F%BA%E7%A1%80">git</a>
      </div>
    </div>
    <div style="margin:0 2%;padding:0.5% 1%;">
      <h1>工具书</h1>
      <div>
        推荐:
        <mark>
          <a href="http://182.10.2.28:9999/railstutorial4th-0.1.2.pdf">rails教程</a>
        </mark>
      </div>
      <a href="http://182.10.2.28:9999/evertdayrailsrspec-cn.pdf">rspec教程</a><br>
    </div>
    <div style="margin:0 2%;padding:0.5% 1%;">
      <h1>当前环境信息</h1>
      <div style="flex-direction:column">
        <p>os:    ubuntu18.04</p>
        <p>ruby:  <%= RUBY_VERSION %></p>
        <p>rails: <%= Rails.version %></p>
        <p>rbenv已安装ruby版本: 2.3.1、2.3.3、2.6.3</p>
      </div>
    </div>
    <div style="margin:0 2%;padding:0.5% 1%;">
      <h1>当前访问ip列表</h1>
      <div style="flex-direction:column">
        <% `netstat -na | grep ESTABLISHED | grep -i 22 | awk '{print $5}' | cut -d: -f1 | sort | uniq -c | sort -n`.split("\n").each do |x| %>
          <p><%= x.strip %></p>
        <% end %>
      </div>
    </div>
  </div>
  <div style="align-items:center;display:flex;flex-direction:column;">
    <h5>Power by: <a href="https://gitee.com/cxwyzPaul/blog">gitee/ossu</a></h5>
  </div>
</div>
